<!DOCTYPE html>
<html>
<head>
	<title>Estadisticas</title>
	<meta charset="utf-8"/>
	<meta name="apple-mobile-web-app-capable" content="yes"/>
	<meta name="viewport" content = "user-scalable=no, width=device-width"/>
	<link rel="shortcut icon" href="Cliente/Imagenes/favicon.ico"> 
	
	<!-- ESTILOS --->	
	<link rel="stylesheet" href="Cliente/Estilo/bootstrap.css">        
	<link rel="stylesheet" href="Cliente/Scripts/Librerias/jqueryui-1.10.4/css/sunny/jquery-ui-1.10.4.custom.css">
	<link rel="stylesheet" href="Cliente/Estilo/font-awesome.css">
    <link rel="stylesheet" href="Cliente/Estilo/template.css">
	<link rel="stylesheet" href="Cliente/Estilo/estructura.css">
	
	<!-- LIBRERIAS -->		
	<script type="text/javascript" src="Cliente/Scripts/Librerias/jquery-1.11.1.min.js"></script>
	<script type="text/javascript" src="Cliente/Scripts/Librerias/jqueryui-1.10.4/js/jquery-ui-1.10.4.custom.js"></script>	
	<script src="Cliente/Scripts/Librerias/bootstrap.js"></script>  
	<script src="Cliente/Scripts/Librerias/highcharts/highcharts.js"></script>
	<script src="Cliente/Scripts/Librerias/highcharts/exporting.js"></script>
			
	<!-- SCRIPTS -->	
	<script type="text/javascript" src="Cliente/Scripts/ajax_facil.js"></script>
	
	<script language="javascript"> 
		$(document).ready(function () {

			// Build the chart
			$('#container').highcharts({
				chart: {
					plotBackgroundColor: null,
					plotBorderWidth: null,
					plotShadow: false
				},
				title: {
					text: 'Usuarios con mayor prestigio'
				},
				tooltip: {
					pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
				},
				plotOptions: {
					pie: {
						allowPointSelect: true,
						cursor: 'pointer',
						dataLabels: {
							enabled: false
						},
						showInLegend: true
					}
				},
				series: [{
					type: 'pie',
					name: 'Browser share',
					data: [
						['Marcela',   45.0],
						['Roberto',       26.8],
						{
							name: 'Valeria',
							y: 12.8,
							sliced: true,
							selected: true
						},
						['Rosa',    8.5],
						['Eva',   6.9]
					]
				}]
			});
			
			// Build the chart
			$('#container2').highcharts({
				chart: {
					plotBackgroundColor: null,
					plotBorderWidth: null,
					plotShadow: false
				},
				title: {
					text: 'Los servicios mas requeridos'
				},
				tooltip: {
					pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
				},
				plotOptions: {
					pie: {
						allowPointSelect: true,
						cursor: 'pointer',
						dataLabels: {
							enabled: false
						},
						showInLegend: true
					}
				},
				series: [{
					type: 'pie',
					name: 'Browser share',
					data: [
						['Plomeria',   40.0],
						['Electricista',       30.2],
						{
							name: 'Pintor',
							y: 19.8,
							sliced: true,
							selected: true
						},
						['Gasista Matriculado',    4.6],
						['Instalador Aire',     5.4]
					]
				}]
			});
			
		});
	</script>
	
</head>
<body>
	
<? include $APP->header;?>
	<div class="todo">
		<div class="container text-center">
			<div id="container" style="width: 45%; height: 400px; margin: 0 auto; float:left;margin-right:10px;"></div>	
			<div id="container2" style="width: 45%; height: 400px; margin: 0 auto; float:left;"></div>
		</div>						
	</div>
		
	<? include $APP->footer;?>

</body>
</html>